<!--
	作者：2575202388@qq.com
	时间：2018-11-21
	描述：登录模块
-->
<template>
	<div>	
		<div style="box-sizing: border-box;height: 100%;">
			<div class="be-content">
				<div class="ioc_text">
	                <span>环西悦·读时光管理系统</span>
	           </div>
				<div>
	                <form action="">
	                    <div class="br-content">
	                        <div style="margin-bottom: 1.5rem !important; display: flex;flex-wrap: wrap; width: 100%;align-items: stretch;">
	                            <div style="margin-right: -1px;display: flex;box-sizing: border-box;">
	                                <Icon class="br-content_icon" type="ios-contact" />
	                            </div>
	                            <input type="text" class="form-control" v-model.trim="params.uname" placeholder="请输入用户名！">
	                        </div>
	
	                        <div style="margin-bottom: 1.5rem !important; display: flex;flex-wrap: wrap; width: 100%;align-items: stretch;">
	                            <div style="margin-right: -1px;display: flex;box-sizing: border-box;">
	                                <Icon class="br-content_icon" type="ios-key" />
	                            </div>
	                            <input type="password" class="form-control" v-model.trim="params.upwd" placeholder="请输入密码！">
	                        </div>
	
	                        <div style="padding-top: 10px;padding-bottom:80px">
	                            <input type="button" class="login-button" value="登    录" v-on:click="savelogin()">
	                        </div>
	                        
	                    </div>
	                </form>
	            </div>   
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		name: "login",
		data() {
			return {
				params:{
					uname:'',
					upwd:''
				}
			}
		},
		methods: {
			setCookie(c_name, value) {
				document.cookie = c_name + "=" + escape(value);
			},
			savelogin() {
				/*var jsessionid = this.$route.query.jsessionid;
				this.setCookie("JSESSIONID", jsessionid);*/
				const params={
							uname:this.params.uname,
							upwd:this.params.upwd
						}
				this.$http.post("/host/readbook/htlogin.html",params)
				.then(datas => {
					if(datas.result){
						var jsessionid =datas.jsessionid;
						this.setCookie("JSESSIONID", jsessionid);
						this.$store.commit("setUser", datas);
						//保存用户信息之sessionstorage
						sessionStorage.setItem('usid',datas.usid);
						sessionStorage.setItem('zw',datas.zw);
						sessionStorage.setItem('dlzh',datas.dlzh);
						sessionStorage.setItem('sex',datas.sex);
						sessionStorage.setItem('nj',datas.nj);
						sessionStorage.setItem('bj',datas.bj);
						sessionStorage.setItem('year',datas.year);
						sessionStorage.setItem('jsessionid',datas.jsessionid);
						sessionStorage.setItem('uname',datas.uname);
						sessionStorage.setItem('permission',datas.permission);
						sessionStorage.setItem('name',datas.name);
						this.$router.push({
							path: "/sjgl"
						});
					}else{
						this.$Modal.error({
                            title: "登录失败",
                            content: datas.msg
                        });	
					}
				});
			}
		},
		mounted() {},
		updated() {}
	}
</script>

<style scoped="scoped">
	body {
	    margin: 0;
	    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	    font-size: 1rem;
	    font-weight: 400;
	    line-height: 1.5;
	    color: #212529;
	    text-align: left;
	    background-color:#eeeeee;
	}
	
	.be-content {
	    max-width: 410px; 
	    margin: 100px auto;
	    background-color: #4D93FA;
	    box-shadow: -2px 2px 4px 0px rgba(0, 0, 0, 0.04);
	    border-width: 0;
	    border-top-width: 0px;
	    border-radius: 3px;
	    z-index: 2222;
	}
	
	.ioc_text {
	    text-align: center;
	    padding-top: 30px;
	    margin-bottom: 50px;
	    color:#fff;
	}
	
	.ioc_text span {
	    display: block;
	    font-size: 20px;
	    margin-top: 11px;
	}

	.br-content {
	    width: 301px;
	    margin: 0px auto;
	}
	
	.br-content_icon{
		display: flex;
	    -ms-flex-align: center;
	    align-items: center;
	    padding: 0.375rem 0.75rem;
	    margin-bottom: 0;
	    font-size: 1rem;
	    font-weight: 400;
	    line-height: 1.5;
	    color: #495057;
	    text-align: center;
	    white-space: nowrap;
	    background-color: #e9ecef;
	    border: 1px solid #ced4da;
	    border-radius: 0.25rem;
	    border-top-right-radius: 0;
	    border-bottom-right-radius: 0;
    }
    
    .form-control {
	    width: 80%;
	    height: calc(2.25rem + 2px);
	    padding: 0.375rem 0.75rem;
	    font-size: 1rem;
	    line-height: 1.5;
	    color: #495057;
	    background-color: #fff;
	    background-clip: padding-box;
	    border: 1px solid #ced4da;
	    border-radius: 0.25rem;
	    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	    border-top-left-radius: 0;
    	border-bottom-left-radius: 0;
	}
	
	.login-button {
		width: 300px; 
		height: 38px;
		color: #fff;                      	
	    background-color: #1266f1;
	    text-align: center;
	    margin: 0;
	    border: 1px solid transparent;
	    border-radius:2px;
	    font-size: 15px;
    }
</style>